import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from '@/router/index.ts'
import { renderWithQiankun, qiankunWindow } from "vite-plugin-qiankun/dist/helper";
// import { globalAppStateManagerPlugin } from "@/plugins/index";
import GlobalState from '@/utils'
import { useMainAppPropsStore } from '@/stores/mainAppPropsStore'; // 假设这是你的 store 文件

let app: any;

function render(props: any = {}) {
  const { container } = props;
  console.log("子应用render", props)
  

//   console.log("container", props, container)
  // 修改挂载逻辑
  const targetContainer = container ? container : document.querySelector("#childrenApp");
  console.log("targetContainer", targetContainer)
  if (!targetContainer) {
    console.error('容器不存在！');
    return;
  }

  // 如果是在 qiankun 中运行，需要保证容器干净 确保在重新渲染时清空容器
  if (container) {
    targetContainer.innerHTML = '';
  }
  
  app = createApp(App, {
    mainAppData: props.mainAppData || "子应用数据"
  });

  
  const pinia = createPinia();
  app.use(pinia);
  app.use(router);
  app.mount(targetContainer);

  if (props?.setGlobalState) {
    console.log("是否到这里了")
    // props?.setGlobalState({
    //   ignore: props.name,
    //   user: {
    //     name: 'vite'
    //   }
    // })
   }
 

//   if(props?.onGlobalStateChange){
//     props?.onGlobalStateChange((pre:any, nex:any) => {
//         console.log('子应用props数据变化', pre, nex);
//       })
//   }

   if(props?.action && props?.onGlobalStateChange){
      // 监听全局状态变化
        props.action.onGlobalStateChange((state:any, prev:any) => {
            console.log('立即反应主应用的参数:', state, prev);
        }, true); // 第二个参数为 true 表示立即执行一次回调，获取当前状态
   }

//    if(props?.setGlobalState){
//         setTimeout(() => {
//             props.action.setGlobalState({
//                 from: 'vue3-app',
//                 data: '我是子应用vue3-app的数据',
//             });
//         }, 3000)
//    }

   // 将 props 数据存储到 store 中
//    const mainAppPropsStore = useMainAppPropsStore(pinia);
//    mainAppPropsStore.setMainAppProps(props);

  GlobalState.initGlobalState(props.action, props.action.setGlobalState, props.action.onGlobalStateChange)

//   app.use(globalAppStateManagerPlugin, {
//     action: props.action,
//     setGlobalState: props.setGlobalState,
//     onGlobalStateChange: props.onGlobalStateChange, 
//   })

}

renderWithQiankun({
    mount(props) {
      console.log('mount--vue子应用', props);
      render(props);
    },
    bootstrap() {
      console.log('bootstrap --vue子应用');
    },
    unmount(props: any) {
      console.log('unmount--vue子应用', props);
      app?.unmount();
      const container = document.querySelector("#childrenApp");
      if (container) {
        container.innerHTML = '';
      }
    },
    update(props: any) {
      console.log('update --vue子应用', props);
    }
  });
  
  // 独立运行时
  if (!qiankunWindow.__POWERED_BY_QIANKUN__) {
    render();
  }
  console.log("qiankunWindow", qiankunWindow.__POWERED_BY_QIANKUN__)

// const app = createApp(App)
// app.use(router)
// app.mount('#app')